<template>
	<view>
		<template v-for="(item, index) in sms" , :key="item.id">
			<view class="mb-5">
				<h2 class="px-3">{{index + 1}}</h2>
				<uni-card :title="item.address" :sub-title="item.person" :extra="shortTime(item.date)"
					:thumbnail="avatar(index)">
					<text class="uni-body text-dark">{{item.body}}</text>
					<view v-if="item.target_email" class="flex justify-start align-center">
						<uni-icons type="email" size="16" color="#00966B" />
						<text class="tips-color text-ellipsis ml-1">{{item.target_email}}</text>
					</view>
					<view v-if="item.cloud" class="flex justify-end align-center">
						<text class="tips-color text-ellipsis mr-1">已保存在云端</text>
						<uni-icons type="cloud-download" size="16" color="#00966B" />
					</view>
				</uni-card>
			</view>
		</template>
	</view>
</template>

<script setup>
	import env from "@/env.js";
	import envConfig from '@/env_config.js';
	import $T from '@/common/time.js';

	const config = envConfig[env];

	defineProps({
		sms: Array
	});

	// Method -- 格式化时间
	const shortTime = (time) => {
		return $T.gettime(new Date(time).valueOf());
	}

	// Method -- 头像
	const avatar = (index) => {
		return `${config['random_avatar_url']}?index=${index}`
	}
</script>

<style lang="less">
	.tips-color {
		color: #00966B;
	}
</style>
